<template>
    <sub-box>
        <breadcrumb :title="'咨询详情'"></breadcrumb>
        <div class="white-block box" v-if="detail">
            <div class="form-common clearfix">
                <div class="form-item">
                    <div class="form-item-label">工具名称</div>
                    <div class="form-item-content">{{detail.resName}}</div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">咨询用户</div>
                    <div class="form-item-content">
                        <el-button class="primary mr10 limit text" size="small">{{detail.deptName}}</el-button>
                        <span>{{detail.userName}}</span>
                    </div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">联系方式</div>
                    <div class="form-item-content">{{detail.phone}}</div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">提交日期</div>
                    <div class="form-item-content">{{detail.createTime}}</div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">当前状态</div>
                    <div class="form-item-content">
                        <span v-if="detail.state==2">已反馈</span>
                        <span v-else class="error">待反馈</span>
                    </div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">详细咨询内容</div>
                    <div class="form-item-content">{{detail.content}}</div>
                </div>
                <div class="form-item">
                    <div class="form-item-label">备注信息</div>
                    <div class="form-item-content">
                        <el-timeline :class="{one: detail.remarkList.length<2}">
                            <el-timeline-item
                                v-for="(item, index) in detail.remarkList"
                                :key="index"
                                type="primary "
                                :timestamp="item.opDeptName+' '+item.opUserName+'（'+item.createTime+'）'"
                                placement="top">
                                {{item.content}}
                                <div v-for="(list,index) in item.fileObjList" :key="index">
                                    <i class="el-icon-document mr10"></i>{{list.fileName}}
                                    <a :href="list.path" target="_blank" class="ml20">
                                        <el-button type="primary" size="mini">下载</el-button>
                                    </a>
                                </div>
                            </el-timeline-item>
                        </el-timeline>
                    </div>
                </div>
            </div>
        </div>
    </sub-box>
</template>

<script>
    import subBox from '../../components/layout/layout-sub'
    import breadcrumb from '../../components/breadcrumb'

    export default {
        name: '',
        data() {
            return {
                id: '',
                detail: null
            }
        },
        mounted() {
            this.id = this.$route.params.id
            if (this.id) this.getDetail()
        },
        methods: {
            getDetail() {
                this.$http.get('/admin/workbench/getIntention', {
                    id: this.id
                }).then(result => {
                    if (result.success) {
                        this.detail = result.data
                    }
                    this.$method.updateView(false, true)
                }).catch(() => {

                })
            }
        },
        components: {
            subBox,
            breadcrumb
        }
    }
</script>

<style scoped lang="less">
    .box {
        padding: .8rem;
    }

    .form-common {
        max-width: 9rem;
    }

    .el-timeline{
        &.one{
            margin-left: -28px;
        }
    }
</style>
